<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html {
	height: 100%
}

body {
	height: 100%;
	margin: 0px;
	padding: 0px
}

#map_canvas {
	height: 100%
}
</style>
<script type="text/javascript"
	src="https://maps.google.com/maps/api/js?sensor=false">
	
</script>
<script type="text/javascript">
	var map;
	function initialize() {

		var locLat = callback.getLocLat();
		var locLon = callback.getLocLon();
		if (locLat == 0 && locLon == 0) {
			if(google.gears){
				var geo = google.gears.factory.create('beta.geolocation');
			    geo.getCurrentPosition(function(position) {
			    	locLat = position.latitude;
					locLon = position.longitude;
			    }, function() {
			    });
			}
			else if(navigator.geolocation) {
				navigator.geolocation.getCurrentPosition(function(position) {
					locLat = position.coords.latitude;
					locLon = position.coords.longitude;
			    }, function() {
			    });
			}
			else{
			}
		}
		if (locLat == 0 && locLon == 0) {
			callback.showError();
		}
		callback.hideDialg();

		var mapZoom = 15;
		var haightAshbury = new google.maps.LatLng(callback.getLat(), callback.getLon());
		var mapOptions = {
			//zoom : mapZoom,
			//center : haightAshbury,
			mapTypeId : google.maps.MapTypeId.ROADMAP
		};
		map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
		marker = new google.maps.Marker({
			position : haightAshbury,
			map : map
		});
		callback.hideDialg();
		if (locLat == 0 && locLon == 0) {
			callback.showError();
			map.setCenter(haightAshbury);
			map.setZoom(mapZoom);
		} else {
			var locLatLon = new google.maps.LatLng(locLat, locLon);
			marker = new google.maps.Marker({
				position : locLatLon,
				map : map
			});
			var bounds = new google.maps.LatLngBounds();
			bounds.extend(haightAshbury);
			bounds.extend(locLatLon);
			map.setCenter(bounds.getCenter(), map.fitBounds(bounds));
		}

	}
</script>
</head>
<body onload="initialize()">
	<div id="map_canvas" style="width: 100%; height: 100%"></div>
</body>
</html>